import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '@/store'
import appMain from "../layout/AppMain.vue";
import commonLayout from "../layout/common-layout.vue";
Vue.use(VueRouter)

const routes = [
    /* 博客主要部分的路由地址 **/
    {
        path: '/',
        name: 'home',
        component: commonLayout,
        redirect: '/index',
        meta: {title: '主体', noCache: true, type: 'layout'},
        children: [
            {
                path: '/helloWorld',
                name: 'helloWorld',
                component: () => import('../components/HelloWorld.vue'),
                meta: {title: 'helloWorld'}
            },
            {
                path: '/index',
                name: 'blogIndex',
                component: () => import('../views/blog/index.vue'),
                meta: {title: '博客首页'}
            },
            // {
            //     path: '/',
            //     name: 'home',
            //     component: () => import('../views/Home.vue'),
            //     meta: {title: '首页'}
            // },
            // {
            //     path: '/category/:cate',
            //     name: 'category',
            //     component: () => import('../views/Home.vue'),
            //     meta: {title: '分类', params: 'cate'}
            // },
            // {
            //     path: '/search/:words',
            //     name: 'search',
            //     component: () => import('../views/Home.vue'),
            //     meta: {title: '搜索', params: 'words'}
            // },
            // {
            //     path: '/about',
            //     name: 'about',
            //     component: () => import('../views/About.vue'),
            //     meta: {title: '关于'}
            // },
            // {
            //     path: '/my',
            //     name: 'my',
            //     component: () => import('../views/My.vue'),
            //     meta: {title: '我的'}
            // },
            // {
            //     path: '/friend',
            //     name: 'friend',
            //     component: () => import('../views/Friend.vue'),
            //     meta: {title: '友链'}
            // },
            // {
            //     path: '/article/:id',
            //     name: 'article',
            //     component: () => import('../views/Articles.vue'),
            //     meta: {title: '文章'}
            // }
        ]
    },
    /* 登录注册的路由*/
    {
        path: '/login',
        name: 'login',
        component: appMain,
        meta: {title: '', noCache: true, type: 'layout'},
        children: [
            {
                path: '/login',
                name: 'login',
                component: () => import('../views/login.vue'),
                meta: {title: '登录'}
            },
            {
                path: '/register',
                name: 'register',
                component: () => import('../views/register.vue'),
                meta: {title: '注册'}
            },
            {
                path: '/helloWorld2',
                name: 'helloWorld2',
                component: () => import('../components/HelloWorld.vue'),
                meta: {title: '首页'}
            },
        ]
    }
]

const router = new VueRouter({
    mode: 'hash',
    base: process.env.BASE_URL,
    routes
})
router.beforeEach((to, from, next) => {
    let title = '异色瞳的小猫'
    if (to.meta.params) {
        title = `${to.meta.title}:${to.params[to.meta.params] || ''} - ${title}`
    } else {
        title = `${to.meta.title} - ${title}`
    }
    document.title = title
    if (to.path !== from.path) {
        store.dispatch('setLoading', true);
    }
    next();
})
router.afterEach(() => {
    // 最多延迟 关闭 loading
    setTimeout(() => {
        store.dispatch('setLoading', false);
    }, 500)
})
// 防止连续点击多次路由报错
let routerPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location) {
    return routerPush.call(this, location).catch(err => err)
}
export default router
